<template>
  <div class="">
    <el-cascader
      :value="value"
      :options="options"
      :props="props"
      clearable
      :size="size"
      style="width: 300px;"
      :disabled="value.length>5"
      @change="handleChange"
    ></el-cascader>
  </div>
</template>
<script>
import {
  findWordStore // 查询词库接口
} from '@/api/tool.js'
export default {
  name: '', // ·������
  model: {
    prop: 'value',
    event: 'change'
  },
  props: {
    value: {
      type: Object,
      default: function() { return [] }
    },
    size: {
      type: String,
      default: 'small'
    }
  },
  data() {
    return {
      props: {
        multiple: true
      },
      storeList: [],
      privateStore: [], // 个人词库
      commonStore: [] // 公共词库
    }
  },
  computed: {
    teamId() {
      return this.$store.state.team.teamId
    },
    options() {
      const arr = [{
        value: 'my',
        label: '个人词库',
        children: this.privateStore
      }]

      if (this.teamId) {
        arr.push({
          value: 'common',
          label: '公共词库',
          children: this.commonStore,
          disabled: !this.commonStore.length
        })
      }
      return arr
    }

  },
  watch: {
    // obj: { //�����Ķ���
    //   deep: true, //���ȼ�������Ϊ true
    //   // ������wacth��������firstName��������֮��������ȥִ��handler����
    //       immediate: true
    //   handler: function(newV, oldV) {
    //     console.log('watch�У�', newV)
    //   }
    // }
  },
  // ������
  created() {},
  // ���غ�
  mounted() {
    this.findWordStoreByTeam('')
    if (this.teamId) {
      this.findWordStoreByTeam(this.teamId)
    }
  },
  // ���ٺ�
  destroyed() {

  },

  // ����
  methods: {
    handleChange(data) {
      let val = []
      if (data.length > 5) {
        this.$message.error('词库选择不能超过5个')
        val = data.slice(0, 5)
      } else {
        val = data
      }

      this.$emit('change', val)
    },

    async findWordStoreByTeam(teamId) {
      if (teamId) {
        this.commonLoading = true
      } else {
        this.myLoading = true
      }
      const obj = {
        page: 1,
        size: 2000,
        teamId
      }

      try {
        const res = await findWordStore(obj)
        this.$message.closeAll()
        if (res.data.code * 1 === 20000) {
          const {
            list
          } = res.data.data

          const arr = list.map(item => {
            return { ...item,
              value: item.wordUserId,
              label: item.name,
              disabled: item.zong * 1 >= 5000
            }
          })

          if (teamId) {
            this.commonStore = arr
          } else {
            this.privateStore = arr
          }
        } else {
          this.$message({
            duration: 1500,
            message: res.data.message || '查询失败',
            type: 'error'
          })
        }
      } catch (err) {}
    }
  }
}
</script>

<style scoped>
</style>
